/**
 * 界面组件维护
 * @author miaoyl
 * @date 2018/01/02 09:35
 */
define(function () {

    var self,
        app = win.app,
        doc = document,
        layui = win.layui,
        table,
        vueData = {
            defaultProps: {
                children: 'children',
                label: 'name'
            },
            treeData: []
        },
        table_where = {
            keyword: '',
            page_id: '0',
            sort: null
        },
        cols = [[
            // {field: 'ROW_ID', width: 60, title: '序号'},
            {
                field: 'NAME',
                width: 120,
                title: '组件名称',
                fixed: 'left',
                sort: true,
                search: 'default',
                searchOpts: {type: 'input'}
            }
            , {field: 'DOM_ID', width: 130, title: '组件ID', sort: true}
            , {
                field: 'DOM_TYPE', width: 120, title: '组件类型',
                filterDatas: app.datas_('sys_cmp_type')
            }
            , {field: 'DOM_PERSSION', width: 200, title: '权限标识', sort: true}
            , {field: 'MODULE_NAME', width: 170, title: '菜单名称', sort: true}
            , {field: 'REMARK', width: 200, title: '备注'}
            , {
                width: 60,
                title: '',
                toolbar: '#script-cmpsetting',
                fixed: 'right',
                align: 'center',
                unresize: true
            }
        ]],
        is_leaf_ = '1',
        moduleNodeData,
        selectNode,
        cmpSettingAction,
        cmp_edit_openOpts = {
            maxmin: true,
            area: ['720px', '312px'],
            title: '界面组件信息编辑'
        }
    ;

    var Cmp = app.Module.extend({
        init: function () {
            self = this;
            self._super({
                _tag: 'cmp',
                _searchs: [{
                    id: 'cmp', tableId: 'cmp_table', datas: cols[0]
                }],
                _loadTplsFull: [{
                    dom: 'cmp_edit', tpl: 'system/cmp_edit'
                }]
            }, win);
        },
        initTable: function () {
            layui.use(['table'], function () {
                table = layui.table;
                table.render({
                    elem: app.getByid(doc, 'cmp_table'),
                    url: g_ctxPath + 'sys/cmp/getCmplist',
                    exportsUrl: g_ctxPath + 'sys/cmp/exportsCmp',
                    exportsName: '界面组件数据',
                    title: '组件信息表',
                    id: 'cmp_table',
                    toolbar: '#table-toolbar',
                    defaultToolbar: ['filter'],//, 'exports'
                    height: 'full',
                    cols: cols,
                    page: true,
                    where: table_where
                });

                layui.laytpl(app.getByid(doc, 'script-cmpsetting-action').innerHTML).render({}, function (string) {
                    cmpSettingAction = string;
                });

                var tipsIndex = null;

                table.on('tool(cmp_table)', function (obj) {

                    layer.tips(cmpSettingAction, obj.td, {
                        tips: [3, '']
                        , time: 5000
                        , anim: 500
                        , maxWidth: 100
                        , skin: 'layui-table-tips'
                        , success: function (layero, index) {
                            tipsIndex = index;
                            layero.find('li').on('click', function () {
                                switch ($(this).attr('inx')) {
                                    case '0':
                                        self._openTplFull({
                                            tag: 'cmp_edit',
                                            tagData: {
                                                obj: obj,
                                                detail: false
                                            },
                                            index: 0,
                                            openOpts: cmp_edit_openOpts
                                        });
                                        break;
                                    case '1':
                                        self.delCmp(obj);
                                        break;
                                }
                                layer.close(index);
                            });
                        }
                    });
                    return false;
                });

                //监听行双击事件
                table.on('rowDouble(cmp_table)', function (obj) {
                    self._openTplFull({
                        tag: 'cmp_edit',
                        tagData: {
                            obj: obj,
                            detail: true
                        },
                        index: 0,
                        openOpts: cmp_edit_openOpts
                    });
                });

                //监听事件
                table.on('toolbar(cmp_table)', function (obj) {
                    switch (obj.event) {
                        case 'add':
                            if (is_leaf_ == '1') {
                                app.showError('操作被取消，请先选择菜单!');
                                return;
                            }
                            self.addCmp(obj);
                            break;
                        case 'init':
                            if (is_leaf_ == '1') {
                                app.showError('操作被取消，请先选择菜单!');
                                return;
                            }
                            app.confirm({
                                msg: '进行初始化会重新生成数据,是否继续?',
                                ok: function () {
                                    app.ajax({
                                        xurl: 'sys/cmp/initUI',
                                        xdata: {"pageId": selectNode.id},
                                        loading: true,
                                        okmsg: '界面组件信息初始化成功',
                                        cb: function (result) {
                                            if (result.ok) {
                                                self.reloadTableCurr();
                                            }
                                        }
                                    });
                                }
                            });
                            break;
                        case 'delete':
                            layer.msg('删除');
                            self.delCmp(obj);
                            break;

                    }
                });

                $(doc).on('click', function () {
                    tipsIndex && layer.close(tipsIndex);
                });

            });
        },
        reloadTableCurr: function () {
            self._reloadTable({id: 'cmp_table', where: table_where});
        },

        addCmp: function (obj) {
            self._openTplFull({
                tag: 'cmp_edit',
                tagData: {is_add: true, page_id: selectNode.id, module_name: selectNode.name},
                index: 0,
                openOpts: cmp_edit_openOpts
            });
        },

        delCmp: function (obj) {
            app.confirm({
                msg: '是否删除选择的信息？',
                ok: function () {
                    app.ajax({
                        xurl: 'sys/cmp/del',
                        xdata: obj.data,
                        loading: true,
                        okmsg: '界面组件信息删除成功',
                        cb: function (result) {
                            if (result.ok) {
                                self.reloadTableCurr();
                            }
                        }
                    });
                }
            });

        },
        initTree: function () {
            app.ajax({
                xurl: 'sys/module/getModulesTree',
                cb: function (result) {
                    if (result.ok) {
                        moduleNodeData = result.data.data;
                        vueData.treeData.pushArray(moduleNodeData);
                        selectNode = moduleNodeData[0];

                    }
                }
            });

        },

        _ready: function () {
            vueData.serchData = table_where;
            this._super({
                vue: [{
                    el: '#page',
                    data: vueData,
                    searchId: 'cmp',
                    methods: {
                        handleNodeClick: function (node) {
                            selectNode = node;
                            table_where.page_id = node.id;
                            if (node.children == undefined) {
                                is_leaf_ = '0';
                                self._reloadTable({id: 'cmp_table', curr: 1, where: table_where});
                            } else {
                                is_leaf_ = '1';
                            }
                        }
                    }
                }]
            });

            self.initTable();
            self.initTree();

        },
        _lazy: function () {
            this._super();
            var treeH = document.querySelector('.el-tree');
            var tableH = document.querySelector('.layui-form').clientHeight;
            treeH.style.height = (tableH + 2) + 'px';

            $(window).resize(function () {
                var tableH = document.querySelector('.layui-form').clientHeight;
                treeH.style.height = (tableH + 2) + 'px';
            })
        }
    });

    return new Cmp();

});